<template>
	<div class="gk-layout-container">
		<div class="gk-layout-header">
			<!--工具栏-->
			<div class="toolbar" style="float:left;">
				<el-form :inline="true" :model="filters" :size="global.gSize">
					<el-form-item>
						<el-select v-model="filters.status" placeholder="请选择任务类型" style="width: 100%;" clearable>
							<el-option v-for="item in dicts1.taskStatus" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item>
						<kt-button :label="$t('action.search')" perms="core:coreTask:view" type="primary"
							@click="findPage(null)" />
					</el-form-item>
				</el-form>
			</div>
		</div>
	
	
		

		<div class="gk-layout-main">
			<my-table :data="pageResult.content"  :loading="loading"  >
				<el-table-column :label="$t('action.desc')" width="50" fixed="left"  header-align="center" align="center">
				  <template slot-scope="scope">   {{scope.$index+1}}   </template>
				</el-table-column> 
				<column  prop="status" label="状态"     :formatter="selectionFormat" >  </column>
				<column   prop="src" label="起始位置"   /> 
				<column   prop="des" label="目标位置"   />  

				<column  prop="createTime" label="创建时间"   :formatter= "dateFormat" />
				<column prop="finshTime" label="完成时间"     :formatter= "dateFormat" /> 
				
				<el-table-column  header-align="center"  align="center"    :label="$t('action.operation')" >
					<template slot-scope="scope">
						<kt-button icon="fa fa-edit"  :label="$t('action.showDetail')"  perms="core:coreTask:showDetail"    @click="handleShowDetail(scope.$index, scope.row)" />
					</template>
				</el-table-column>
			</my-table>
		</div>
		<!--分页栏-->
		<div class="toolbar gk-layout-footer"  style="padding:10px;">
		  
		  <el-pagination layout="total, prev, pager, next, jumper"  @current-change="findPage"
						 :current-page="pageRequest.pageNum"
						 :page-size="pageRequest.pageSize"
						 :total="pageResult.totalSize"
						 style="float:right;">
		  </el-pagination>
		</div>


		<!--新增编辑界面-->
		<el-dialog :title="'查看'" width="70%" :visible.sync="editDialogVisible" :close-on-click-modal="false">
			<el-form :model="dataForm" label-width="80px" ref="dataForm" :size="global.gSize" label-position="right">
				<el-row :gutter="20">

					<el-col :span="8">
						<el-form-item label="状态" prop="status">
							<el-select v-model="dataForm.status" style="width: 100%;" :disabled="false">
								<el-option v-for="item in dicts.taskStatus" :key="item.value" :label="item.label"
									:value="item.value">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="开始" prop="taskType">
							<el-input v-model="dataForm.src" style="width: 100%;" :disabled="false">
								
							</el-input>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="结束" prop="taskType">
							<el-input v-model="dataForm.des" style="width: 100%;" :disabled="false">
								
							</el-input>
						</el-form-item>
					</el-col>
				</el-row>
			
			</el-form>
			<div class="gk-layout-main">
				<my-table :data="pageResultDetail.content"    :loading="loading"  >
					<el-table-column :label="$t('action.desc')" width="50" fixed="left"  header-align="center" align="center">
					  <template slot-scope="scope">   {{scope.$index+1}}   </template>
					</el-table-column>
					<column    prop="taskNo" label="任务号"   >  </column>
					<el-table-column header-align="center"  align="center"   prop="src" label="起始位置"  key="pos"  >  </el-table-column>
					<el-table-column header-align="center"  align="center"  prop="des" label="目标位置"   key="des"   >  </el-table-column>
					
					<el-table-column header-align="center"  align="center"   prop="createTime" label="创建时间"  key="createTime"  :formatter= "dateFormat" >  </el-table-column>
					<el-table-column header-align="center"  align="center"   prop="type" label="类型"     key="type" :formatter= "selectionFormat" >  </el-table-column>
					<el-table-column header-align="center"  align="center"   prop="status" label="状态"     key="status" :formatter= "selectionFormat1" >  </el-table-column>
				</my-table>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import Column from "@/views/Core/Column"
	import KtButton from "@/views/Core/KtButton"
	import { format } from "@/utils/datetime"
	import MyTable from "@/views/Core/MyTable"
	export default {
		components: {
		Column,
			KtButton,
			MyTable

		},
		data() {
			return {
				size: 'small',
				filters: {
					
				},
				dicts: {},
				dicts1: this.$store.state.dict.dicts,
				loading:false,
				pageRequest: { pageNum: 1, pageSize: 10 },
				pageResult: {},
				pageResultDetail: {},
				operation: false, // true:新增, false:编辑
				editDialogVisible: false, // 新增编辑界面是否显示
				editLoading: false,
				dataFormRules: {
					label: [
						{ required: true, message: '请输入名称', trigger: 'blur' }
					]
				},
				// 新增编辑界面数据
				dataForm: {
					id: null,
					stockId: null,
					areaId: null,
					boxCode: null,
					status: null,
					taskType: null,
					createTime: null,
					finshTime: null,
					relyTaskId: null,
					maxStock: null,
					info: null,
					bussType: null,
					priority: null,
					src: null,
				}
			}
		},
		methods: {
			// 获取分页数据
			findPage: function (data) {
		
				data=data||1;
				
					this.filters.pageNum =data
					this.pageRequest.pageNum = data
				
				this.filters.pageSize = this.pageRequest.pageSize
				this.$api.coreTask.findPage(this.filters).then((res) => {
					this.pageResult = res.data
				}).then(data != null ? data.callback : '')
			},
			// 获取明细数据
			findDetailPage: function (data) {
				this.dicts = this.$store.state.dict.dicts
				this.$api.coreTask.GetListByTaskId(data).then((res) => {
					this.pageResultDetail = { content: res.data }
				}).then(data != null ? data.callback : '')
			},
			// 显示详情界面
			handleShowDetail: function (index,row) {
				this.editDialogVisible = true
				this.dataForm = Object.assign({}, row)
				this.findDetailPage(row);
			},
			// 时间格式化
			dateFormat: function (row, column, cellValue, index) {
				return format(row[column.property])
			},
			selectionFormat: function (row, column, cellValue, index) {
				let key = ""
			
				let propt = column.property;
				if (propt == "taskType") {
					key = "taskType"
				} else if (propt == "status") {
					key = "taskStatus"
				} else if (propt == "type") {
					key = "paramType"
				}
				
				let val = row[column.property];
				let dict = this.$store.state.dict.dicts[key];
				if (dict == undefined) {
					return row[column.property]
				}
				for (let i = 0; i < dict.length; i++) {
					if (dict[i].value == val) {
						return dict[i].label;
					}
				}
				return row[column.property]
			},
			selectionFormat1: function (row, column, cellValue, index) {

			
				let dict = this.$store.state.dict.dicts['paramStatus'];
				if (dict == undefined) {
					return cellValue
				}
				for (let i = 0; i < dict.length; i++) {
					if (dict[i].value == cellValue) {
						return dict[i].label;
					}
				}
				
				return cellValue;
			}
		},
		mounted() {
			
			this.findPage(null)
		}
	}
</script>

<style scoped>

</style>